<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta charset="utf-8">
<title>来三星抢Galaxy S6，把S6带回家</title>
<meta name="viewport"
	content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" />
<meta name="format-detection" content="telephone=no,address=no,email=no" />
<meta name="mobileOptimized" content="width" />
<meta name="handheldFriendly" content="true" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<link rel="stylesheet" href="${contextPath}/style/base.css" />
<link rel="stylesheet" href="${contextPath}/style/common.css" />
<link rel="stylesheet" href="${contextPath}/style/s.css" />
</head>

<body>

	<!-- s=header -->
	<header>
		 <div id="logo"></div>
   		 <a class="icon_gameDes" id ="icon_gameDes"></a>
	</header>
	<!-- e=header -->

	<!-- s=body -->
	<div class="wel">
		<form action="${contextPath}/user/toDetail" id="dataForm">
			<select name="provinces" id="provinces">
				<option value="${province_id}">${province_name}</option>
			</select>
			<input type="hidden" id="province_name" name="province_name" value="${province_name}"/>
			 
			<select name="city" id="city">
				<option value="${city_id}">${city_name}</option>
			</select>
			<input type="hidden" id="city_name" name="city_name" value="${city_name}"/>
			
			 <select name="stores" id="stores">
			 	<option value="${store_id}">${store_name}</option>
			 </select>
			 <input type="hidden" id="store_name" name="store_name" value="${store_name}"/>
			 
			  <input type="button" id="btn_star" class="btn_star" value="">
		</form>
		<p class="checkLeaderboard">
			<a href="#" class="link" id="showRank">查看排行榜</a>
		</p>
		<a href="#" id="" class="arrow"></a>
	</div>
	<!-- e=body -->

	<!-- s=overlayer -->
	<div class="overlayer  " id="father">

		<!-- s=游戏说明 -->
		<div class="gameDes overlayerCnt fn-hide">
			<dl>
				<dt>游戏说明：</dt>
				<dd>
					30秒游戏内，控制屏幕的小手方向疯狂抢GALAXY S6，留下你的联系方式，也许GALAXY S6就属于你！要小心炸弹哦~！
				</dd>
			</dl>
			<dl>
				<dt>活动周期：</dt>
				<dd>4月1日-4月8日</dd>
				<dd>4月9日-4月16日</dd>
				<dd>4月17日-4月24日</dd>
				<dd>4月25日-5月3日</dd>
			</dl>
			<dl class="prizeWrap">
				<dt>奖品说明：</dt>
				<dd>
					<ul class="prize">
						<li><img src="${contextPath}/case/pic_phone.png" alt="">
							<p>GALAXY S6</p> <span class="quantity">（共4部）</span></li>
						<li><img src="${contextPath}/case/pic_mobiePower.png" alt="">
							<p>三星移动电源</p> <span class="quantity">（共40部）</span></li>
						<li><img src="${contextPath}/case/pic_headPhone.png" alt="">
							<p>三星耳机</p> <span class="quantity">（共40台）</span></li>
					</ul>
					<p>每周随机抽取1名星粉获得GALAXY S6手机1部，共4周；</p>
					<p>4月8日，4月16日，4月24日，5月3日的24:00游戏截止时，排名第第一名至第十名的星粉可以获得三星移动电源各1台，第十一名至第二十名可以获得三星耳机各1个，共4周。</p>
					<p>活动现场还有更多小礼品可以赢取哦~</p>
					<p class="emphasize">*获奖名单请留意华南三星微信公众号。</p>
					<p class="emphasize">只能在指定门店参与活动</p>
				</dd>
			</dl>
			<dl class="tips">
				<dt>温馨提示：</dt>
				<dd>1.中奖者将有专人电话联系通知；</dd>
				<dd>2.由于配送范围限制，奖品仅限广东、广西、福建、海南省内地址登记领奖；</dd>
				<dd>2.由于配送范围限制，奖品仅限广东、广西、福建、海南省内地址登记领奖；</dd>
			</dl>
			<a href="#" class='overlayer_close'></a>
		</div>
		<!-- s=游戏说明 -->

		<!-- s=查询排行榜 -->
		<div class="overlayerCnt qr fn-hide" id="rank">
			<img src="${contextPath}/case/queryRanking.png" width="127" alt="" class="title">
			<p class="tips">输入手机号码查看自己的排名哦~</p>
			<form id="phoneForm" action="${contextPath}/user/getTopAndMe" >
				<label>手机号码：<input type="text" class="ipt_tel" name="phone"></label> 
				<input type="hidden" name="provinces1"  id="provinces1" value=""/>
				<input type="hidden" name="province1_name"  id="province1_name" value="${province_name}"/>
				
				<input type="hidden" name="city1" id="city1" value=""/>
				<input type="hidden" name="city1_name" id="city1_name" value="${province_name}"/>
				
				<input type="hidden" name="stores1" id="stores1" value="city_name"/>
				<input type="hidden" name="store1_name" id="store1_name" value="store_name"/>
				<input
					type="button" onclick="subPhone()" value="" class="btn_check">
			</form>
			<a href="#" class="overlayer_close" id="close"></a>
		</div>

		<!-- s=验证码 -->
		<div class="overlayerCnt qr " id="code_dialog">
			<img src="${contextPath}/case/sn.png" width="133" alt="">
			<form action="${contextPath}/code/select">
				<label><input type="text" class="ipt_tel ipt_sn"
					placeholder="输入验证码"  id="code"></label> 
					<input type="button" value="" class="btn_sure" id="code_submit">
			</form>
			
		</div>
		<!-- s=验证码 -->

	</div>
	

	<!-- e=overlayer -->
	<script src="${contextPath}/script/jquery-1.11.2.min.js"></script>
	<script src="${contextPath}/script/load.js"></script>
	<script src="${contextPath}/script/s.js"></script>
	<script type="text/javascript">
	var sid;
	var store;
	var city_id ;
	var cid;
	var province;
		
	$(function(){
		// $("#showRank").click(function(){
		// 	$("#father").css("display","block");
		// 	$("#rank").css("display","block");
			
		// });
		
		// $("#close").click(function(){
		// 	$("#father").css("display","none");
		// })
		
		// $("#code_close").click(function(){
		// 	$("#code_dialog").css("display","none");
		// });
		result = '${param.result}';
		if(result == "1"){
			 result = '${param.result}';
			 province ='${param.provinces}';
			 city_id = '${param.citys}';
			 sid = '${param.stores}';
			$("#code_dialog").hide();
			$("#father").hide();
			$("#provinces").children("option").each(function(){
				if (province == $(this).val().trim()) {
					$("#provinces").val(province);
				}
			});
		}
		
		var $phoneForm = $("#phoneForm");
		$phoneForm.find(":submit").on("click", function(){
			var $phone = $phoneForm.find("[name=phone]");
			if(!/^\d{11}$/.test($phone.val())){
				alert("请输入正确的手机号");
				return false;
			}
		});
		
		
		
/* 	
		$("#code_submit").click(function() {
				$.ajax({
					url : '${contextPath}/code/select',
					type : 'post',
					dataType : 'json',
					data : {
						'code' : $("#code").val()
					},
					error : function() {
						alert('网络连接错误');
					},
					success : function(data) {
						var d = data.code;
						if (d == "1") {
							$("#father").hide();
						} else {
							alert("验证码错误");
						}
					}
				});
			}); */
			

			$("#code_submit").click(function() {
				$.ajax({
					url : '${contextPath}/code/selectCodeInfo',
					type : 'post',
					dataType : 'json',
					data : {
						'code' : $("#code").val()
					},
					error : function() {
						alert('网络连接错误');
					},
					success : function(data) {
						var code = data.code;
						var info = data.info;
						
						
						
						if (code == "1") {
							sid = info.stoid;
							//店名
							store = info.store;
							//城市id
							city = info.city;
							cid = info.cid;
							//省份名
							province = info.province;
							//省份id
							province_id = info.pid;
							$("#provinces").empty();
							$("#city").empty();
							$("#stores").empty();
							$("#provinces").append("<option value="+province_id+">"+province+"</option>");
							$("#city").append("<option value="+cid+">"+city+"</option>");
							$("#stores").append("<option value="+sid+">"+store+"</option>");
							
							$("#province_name").val(province);
							$("#city_name").val(city);
							$("#store_name").val(store);
							
							$("#province1_name").val(province);
							$("#city1_name").val(city);
							$("#store1_name").val(store);
							
							$("#father").hide();
						} else {
							alert("验证码错误");
							return false;
						}

					}
				});
			})

			$("#btn_star").click(function() {
				var p = $("#provinces").val();
				var s = $("#stores").val();
				var c = $("#city").val();
				if (p == "" || s == "" || c == "") {
					alert("亲，资料填写不完整");
					return;
				}
				$("#dataForm").submit();
			});
		})

		/**function updateCity() {
			var province_id = $("#provinces").val();
			if (province_id == "") {
				$("#city").empty();
				$("#city").append('<option value="">选择城市</option>');
				return;
			} else {
				$("#city").empty();
				$.ajax({
					url : '${contextPath}/city/selectAll',
					type : 'get',
					dataType : 'json',
					data : {
						'province_id' : province_id
					},
					error : function() {
						alert('网络连接错误');
					},
					success : function(data) {
						console.log(data);
						var list = data.data;
						var html1 = "";
						$.each(list, function(i, v) {
							html1 = "<option value="+v.id+">" + v.city
									+ "</option>";
							$("#city").append(html1);
						});
						
						updateStore();
					}
				});
			}
		}
**/
		/**function updateStore() {
			var city_id = $("#city").val();
			if (city_id == "") {
				$("#stores").val("");
				return;
			} else {
				$("#stores").empty();
				$.ajax({
					url : '${contextPath}/store/selectAll',
					type : 'get',
					dataType : 'json',
					data : {
						'city_id' : city_id
					},
					error : function() {
						alert('网络连接错误');
					},
					success : function(data) {
						$("#stores").empty();
						console.log(data);
						var list = data.data;
						var html1 = "";
						$.each(list, function(i, v) {
							html1 = "<option value="+v.id+">" + v.store
									+ "</option>";
							$("#stores").append(html1);
						});
						
					}
				});
			}
		}**/
		
		function subPhone(){
			var prov = $('#provinces').val();
			var cit = $('#city').val();
			var stor = $('#stores').val();
			
			var prov_name =$('#province_name').val();
			var city_name = $('#city_name').val();
			var store_name = $('#store_name').val();
			
			$('#provinces1').val(prov);
			$('#city1').val(cit);
			$('#stores1').val(stor);
			
			$('#province1_name').val(prov_name);
			$('#city1_name').val(city_name);
			$('#store1_name').val(store_name);
			
			$('#phoneForm').submit();
		}
		
	</script>
</body>
</html>